<template>
  <view class="about-container">
    <view class="about-header">
      <image class="app-logo" src="/static/images/logo.png"></image>
      <text class="app-name">投趣校园</text>
    </view>
    <view class="about-content">
      <text class="app-desc">
        &ensp;&ensp;&ensp;&ensp;投趣校园是一款校园生活社区产品，旨在简化和优化校园内的投票流程。该小程序可以用于各种场合，如学生会选举、班级代表投票、校园活动投票等。
      </text>
    </view>
    <view class="about-footer">
      <image
        class="vote-background"
        src="/static/images/vote_background.png"
      ></image>
    </view>
  </view>
</template>

<script setup lang="ts"></script>

<style scoped lang="scss">
.about-container {
  display: flex;
  flex-direction: column;

  .about-header {
    margin-top: 120rpx;
    display: flex;
    flex-direction: column;
    align-items: center;
    .app-logo {
      height: 128rpx;
      width: 128rpx;
    }
    .app-name {
      font-size: 28rpx;
      color: #333;
      margin-top: 20rpx;
    }
  }

  .about-content {
    margin-top: 50rpx;
    padding: 0 50rpx;
    .app-desc {
      font-size: 28rpx;
      color: #333;
    }
  }

  .about-footer {
    margin-top: 150rpx;
    width: 100%;
    .vote-background {
      width: 100%;
    }
  }
}
</style>
